<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=4, user-scalable=no, width=device-width">
    <title></title>

    <!--公共css-->
    

    <link href="lib/ionic/css/ionic.css" rel="stylesheet">
    <link href="css/common.css" rel="stylesheet">
    
    

    <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
    <link href="css/ionic.app.css" rel="stylesheet">
-->
<script src="lib/ionic/js/ionic.bundle.js"></script>
<!-- ionic/angularjs js -->


<!-- cordova script (this will be a 404 during development) -->



</head>
<body ng-app="myApp" ng-controller="demoController">
    <ion-nav-view>
        <ion-tabs>

            <ion-tab title="Tab 1">
              你好，标签1！
              <button ng-click="selectTabWithIndex(2)" style="background-color: red;height:50px;width: 100px;border:none">选择标签3</button>
          </ion-tab>
          <ion-tab title="Tab 2">
              你好标签2！
              <button ng-click="selectTabWithIndex(0)" style="background-color: red;height:50px;width: 100px;border:none">选择标签1</button>
          </ion-tab>
          <ion-tab title="Tab 3">你好标签3！
              <button ng-click="selectTabWithIndex(1)" style="background-color: red;height:50px;width: 100px;border:none">选择标签2</button>
       </ion-tab>

   </ion-tabs>
</ion-nav-view>


</body>
<script type="text/javascript">

    var app =  angular.module('myApp',['ionic']);

    app.controller('demoController',['$scope','$ionicTabsDelegate',function($scope,$ionicTabsDelegate){

      $scope.selectTabWithIndex = function(index) {
        $ionicTabsDelegate.select(index);
    };
}]);






</script>
</body>
</html>
